<!DOCTYPE html>
<html>
<head>
    <title>{$nav.title}</title>
    <link href="/static/index/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="/static/index/js/jquery.min.js"></script>
    <!-- Custom Theme files -->
    <!--theme-style-->
    <link href="/static/index/css/style.css" rel="stylesheet" type="text/css" media="all" />
    <!--//theme-style-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="" />
    <script type="application/x-javascript">
        addEventListener("load", function() {
            setTimeout(hideURLbar, 0);
        }, false);

        function hideURLbar() {
            window.scrollTo(0, 1);
        }
    </script>

    <script src="/static/index/js/easyResponsiveTabs.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#horizontalTab,#horizontalTab1,#horizontalTab2').easyResponsiveTabs({
                type: 'default', //Types: default, vertical, accordion
                width: 'auto', //auto or any width like 600px
                fit: true // 100% fit in a container
            });
        });
    </script>
</head>

<body>
<!--header-->
<div class="header">
    <div class="header-top">
        <div class="container">
            <div class="logo">
                <h1><a href="{:url('index')}">{$setting.copy_name}</a></h1>
            </div>
            <div class="top-nav">
                <span class="menu"><img src="/static/index/images/menu.png" alt=""> </span>

                <ul>
                    <ul>
                        {volist name="navigation" id="vo"}
                            <li {if $vo.action eq $nav.action} class="active" {else}{/if}>
                                <a href="/index/{$vo.controller}/{$vo.action}">{$vo.title}</a>
                            </li>
                        {/volist}
                    </ul>
                </ul>

                <!--script-->
                <script>
                    $("span.menu").click(function() {
                        $(".top-nav ul").slideToggle(500, function() {});
                    });
                </script>
            </div>
            <div class="clearfix"> </div>
        </div>
    </div>
</div>
<!--幻灯片-->
<section class="banner_img">
    <img src="{$setting.about_img}">
</section>
<!--面包屑-->
<div class="our-grid">
    <div class="container">
        <h6 class="dress"><a href="index.html">首页</a> <i class="glyphicon glyphicon-menu-right"></i>{$nav.title}</h6>
        <div class="clearfix"> </div>
    </div>
</div>
<!--关于我们-->
<div class="content-middle">
    <div class="container">

        <div class="col-md-6 grid-1">
            <h3>{$about.title}</h3>
            <p>{$about.content}</p>

            <ul class="grid-part">

                {volist name="about_list" id="vo"}
                <li>
                    <a href="/index/index/about/id/{$vo.id}"><i class="glyphicon glyphicon-ok-sign"> </i> {$vo.title}</a>
                </li>
                {/volist}

            </ul>

        </div>
        <div class="col-md-6 span_8">

            <div class="row_8">
                <div class="sap_tabs">
                    <div id="horizontalTab" style="display: block; width: 100%; margin: 0px;">

                        <div class="resp-tabs-container">
                            <?php for($i = 0; $i<count($image_arr); $i++): ?>
                            <h2 class="resp-accordion " role="tab" aria-controls="tab_item-<?php echo $i?>"><span class="resp-arrow"></span></h2>
                            <div class="tab-1 resp-tab-content " aria-labelledby="tab_item-<?php echo $i?>">
                                <div class="facts">
                                    <img src="<?php echo $image_arr[$i] ?>" class="img-responsive" alt="">
                                </div>
                            </div>
                            <?php endfor; ?>

                        </div>
                        <ul class="resp-tabs-list">

                            <?php for($i = 0;$i<count($image_arr);$i++): ?>
                                <li class="resp-tab-item" aria-controls="tab_item-<?php echo $i ?>" role="tab"><span><img style="height:120px;" src="<?php echo $image_arr[$i] ?>" class="img-responsive" alt=""></span></li>
                            <?php endfor; ?>

                            <div class="clearfix"> </div>

                        </ul>
                    </div>
                </div>
            </div>

        </div>
        <div class="clearfix"> </div>
    </div>
</div>
<div class="about-grid">
    <div class="about-grid-to">
        <div class="container">
            {volist name="about_set" id="vo"}
            <div class="col-md-3 about-grid1">
                <label>{$vo.descr}</label>
                <b></b>
                <span>{$vo.name}</span>
            </div>
            {/volist}
            <div class="clearfix"> </div>
        </div>
    </div>
</div>
<!-- start content_slider -->
<div class="con-in">
    <div class="container">
        <div class="top-1">
            <h3>工地风采</h3>
            <p>实拍工地现场</p>
        </div>
        <div class="wmuSlider example1">
            <div class="wmuSliderWrapper">
                {volist name="live" id="vo"}
                <article style="position: absolute; width: 100%; opacity: 0;">
                    <div class=" item-in">
                        <img src="{$vo.image}">
                    </div>
                </article>
                {/volist}
            </div>
            <ul class="wmuSliderPagination">
                {volist name="live" id="vo"}
                <li>
                    <a href="javascript:;" class="">{$key}</a>
                </li>
                {/volist}
            </ul>
        </div>
        <script src="/static/index/js/jquery.wmuSlider.js"></script>
        <script>
            $('.example1').wmuSlider();
        </script>
    </div>
</div>


<!--联系我们-->
<footer class="footer">
    <div class="container">
        <div class="b-nav wow fadeInUp" data-wow-delay=".1s">
            {volist name="navigation" id="vo"}
            <a href="/index/{$vo.controller}/{$vo.action}">{$vo.title}</a>
            {/volist}
        </div>
        <p class="wow fadeInUp jshu" data-wow-delay=".3s">{$setting.copy_descr}</p>
    </div>
</footer>
</body>

</html>